
<!-- menu-all -->
{include file="common@public/_category" /}

<!--container-->
<div class="container container-gary">
    <!-- member index -->
    <div class="m-ptb wrap clearfix">
        {include file="common@public/_personal_left" /}
        <div class="member-right">
            <div class="member-sign clearfix"><b>我的账单</b></div>
            <div class="member-order min-height">
                <div class="redpacked-title clearfix">
                    <div class="redpacked-t-l">
                        <span class="current" value="all">全部账单</span><span value="1">销售订单</span>
                        <span value="2">退款</span><span value="7">充值</span><span value="4">白条还款</span><span value="3">账户调整</span>
                    </div>
                </div>
                <div class="m-order-enter clearfix">
                    <div class="m-order-left m-l-bill">
                        <div class="m-order-item">
                            <div class="m-order-text bill-w1">单据日期：</div>
                            <div class="m-order-write">
                                <input class="input-time laydate-icon" value="" id="start" type="text" placeholder="起始时间" />
                                <span class="m-order-plr">至</span>
                                <input class="input-time laydate-icon"  value="" id="end" type="text" placeholder="起始时间" />
                            </div>
                        </div>
                        <div class="m-order-item">
                            <div class="m-order-text bill-w1">单据编号：</div>
                            <div class="m-order-write">
                                <input class="m-input-small bill-w2" id="no" type="text" placeholder="请输入订单号" />
                            </div>
                        </div>
                        <div class="m-order-item">
                            <div class="m-order-text bill-w1">账户类型：</div>
                            <div class="m-order-write">
                                <select class="m-o-select bill-s-w1" id="capital_type" style="width:238px;">
                                    <option value="1">普通账户</option>
                                    <option value="2">信用额度</option>
                                </select>
                            </div>
                        </div>
                        <div class="m-order-item">
                            <div class="m-order-text bill-w1">交易类型：</div>
                            <div class="m-order-write">
                                <select class="m-o-select bill-s-w1" id="transaction_type">
                                    <option value="1">交易类型1</option>
                                    <option value="2">交易类型2</option>
                                    <option value="3">交易类型3</option>
                                    <option value="4">交易类型4</option>
                                    <option value="5">交易类型5</option>
                                </select>
                            </div>
                        </div>

                    </div>
                    <div class="m-order-right m-r-bill">
                        <input class="m-btn-color" type="button" value="查询"  onclick="jump()"/> <input type="button" value="导出Excel" />
                    </div>
                </div>

                <div class="whitebar-content" >
                    <div class="member-thead clearfix">
                        <div class="m-bill-t-w1">单据日期</div>
                        <div class="whitebar-t-w2">交易类型</div>
                        <div class="whitebar-t-w3"> 单据编号</div>
                        <div class="whitebar-t-w4">收货人</div>
                        <div class="whitebar-t-w5">支付方式</div>
                        <div class="whitebar-t-w6">订单金额</div>
                        <div class="whitebar-t-w7">实付金额</div>
                        <div class="m-bill-t-w7">账户余额</div>
                    </div>
                    <div id="capital">

                    </div>
                </div>

                <div class="inpuire-b-select clearfix" style="display:none">
                    <div class="pager address-pager">
                        <a href="" title="First page">首页</a> <a href="" class="Previous page">上一页</a>
                        <a href="" title="">1</a> <span class="current">2</span> <span class="page-line">...</span> <span class="disabled">下一页</span> <span class="disabled">末页</span>
                        <em>到第</em><input class="page-input" type="text" /><i>页</i><input class="page-btn" type="button" value="确认" />
                    </div>
                </div>
            </div>

        </div>
    </div>

</div>

<!-- footer -->
<!--#include file="includes/foot.html"-->

<!-- date -->
<script type="text/javascript" src="/Public/static/home/js/laydate.js"></script>
<!-- menu -->
<script type="text/javascript" src="/Public/static/home/js/menu.js"></script>
<script>
    $(function(){
        //top select
        $(".top-select").mouseover(function () {
            $(".top-s-text").show();
        })
        $(".top-select").mouseout(function () {
            $(".top-s-text").hide();
        })
        $(".top-s-text div").click(function () {
            var selecttext = $(this).text();
            $(".top-s-head span").text(selecttext);
            $(this).parent(".top-s-text").hide()
        })
        // top code
        var turn = function(target,time,opts){
            target.find('.top-code').hover(function () {
                $(this).find('.top-c-img').stop().animate(opts[0], time, function () {
                    $(this).hide().next().show();
                    $(this).next().animate(opts[1],time);
                });
            },function(){
                $(this).find('.top-c-text').animate(opts[0], time, function () {
                    $(this).hide().prev().show();
                    $(this).prev().animate(opts[1],time);
                });
            });
        }
        var verticalOpts = [{'width':0},{'width':'80px'}];
        turn($('.top-right'), 150, verticalOpts);
        //menu all
        $(".menu-all div").mouseenter(function () {
            $(this).addClass("current");
            $(".submenu").show();
        })
        $(".menu-all div").mouseleave(function () {
            $(this).removeClass("current");
            $(".submenu").hide();
        })
        $(".submenu").mouseenter(function(){
            $(this).show();
            $(".menu-all div").addClass("current")
        })
        $(".submenu").mouseleave(function(){
            $(this).hide();
            $(".menu-all div").removeClass("current")
        })
        //left submenu
        $(".submenu ul li").each(function () {
            var $this = $(this);
            var $children = $this.find('.submenu-pro');
            var $otherChildren = $this.siblings('li').find('.submenu-pro');
            var $childrenList = $children.children('.submenu-total');
            $this.on({
                'mouseenter': function () {
                    $children.css({ 'display': 'block', 'width': 221 * parseInt($childrenList.size()) });
                    $otherChildren.css('display', 'none');
                },
                'mouseleave': function () {
                    $children.css('display', 'none');
                }
            })
        });
        //member left
        $(".member-l-title").click(function(){
            $(this).parent(".member-l-list").toggleClass("m-current");
            $(this).parent(".member-l-list").find("ul").slideToggle()
        })
        //content height
        $(".member-left").height($(".member-right").height())
    })

    //date
    !function () {
        laydate.skin('molv');//切换皮肤，请查看skins下面皮肤库
    }();
    //日期范围限制
    var start = {
        elem: '#start',
        format: 'YYYY-MM-DD',
        min: '1996-06-16', //设定最小日期为当前日期 laydate.now()
        max: '2099-06-16', //最大日期
        istime: true,
        istoday: false,
        choose: function (datas) {
            end.min = datas; //开始日选好后，重置结束日的最小日期
            end.start = datas //将结束日的初始值设定为开始日
            $(".laydate-icon").first().addClass("current");
        }
    };
    var end = {
        elem: '#end',
        format: 'YYYY-MM-DD',
        min: '1996-06-16',
        max: '2099-06-16',
        istime: true,
        istoday: false,
        choose: function (datas) {
            start.max = datas; //结束日选好后，充值开始日的最大日期
            $(".laydate-icon").eq(1).addClass("current");
        }
    };
    laydate(start);
    laydate(end);

</script>

<script type="text/javascript">;
    jump();
    function jump(){
        var start_time=$("#start").val();
        var end_time=$("#end").val();
        var type=$("#capital_type").val();
        var transaction=$("#transaction_type").val();
        var no=$("#no").val();
        var user_type=$(".current").attr('value');
        $.ajax({
            type:'post',
            url:"{:url('membercapital/member_capital')}",
            data:{start:start_time,end:end_time,type:type,transaction:transaction,no:no,user_type:user_type},
            success:function(data){
                $("#capital").html(data);
                $(".inpuire-b-select").css('display','block');
            }
        });
    }

    $(".redpacked-t-l span").each(function(){
        $(this).on({
            'click':function(){
                $(this).addClass("current").siblings().removeClass()
                jump();
            }
        })
    })


</script>
</body>
</html>